<template>
  <div id='DJFBchart' style="width: 500px;height:200px;margin:0 auto;"></div>
</template>

<script>
  import echarts from 'echarts'
  import {GETDJFBPIEDATA} from '@/../static/js/apis.js'

  export default {
    name: "DJFBchart",
    methods: {
      //绘制图形
      drawChart(data) {
        let myChart = echarts.init(document.getElementById('DJFBchart'))
        let options = {
          tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b}涉密单位 : {c}家  ( {d}% )"
          },
          legend: {
            orient: 'vertical',
            x: 'left',
            top: '50',
            data: ['一级', '二级', '三级']
          },
          series: [{
            name: '等级占比',
            type: 'pie',
            data: data
          }]
        }
        myChart.setOption(options, true)
      },
      //获取数据
      getData() {
        const self = this;
        GETDJFBPIEDATA('', function (res) {
          if (res.pieData) {
            //绘制图形
            self.drawChart(res.pieData);
          }
        })
      }
    },
    mounted() {
      this.getData();
    }
  }

</script>

<style scoped>

</style>
